$(document).ready(function () {
    //Scale percentage for all elements in all dimensions
    var scalePercentage = 100;
    //$('.elements > img').hide();
    $(window).on('resize', positionBackground);
	$(".fancybox").fancybox({
		openEffect	: 'none',
		closeEffect	: 'none',
        helpers : {
			media : {}
		}
	});
	$('.fancybox-media').fancybox({
		openEffect  : 'none',
		closeEffect : 'none',
		helpers : {
			media : {}
		}
	});
	$('.gallery').carouSlide();
    $.fn.carouSlide.resetItems();
	initiateContactForm();

});
$(window).load(function () {
    positionBackground();
    showHomeVideo();
	$('.wrapper').gdParallax();
    $(window).resize();
});
function getProportionalHeight(){
	var imgWidth = 1600;
    var imgHeight = 958;
	
	return (imgHeight/imgWidth) * $(window).width();
}
function positionBackground() {
    var imgWidth = 1600;
    var imgHeight = 958;
    var wrapper = $('#wrapper');
    var bgImage = $(".bg-container");
    $(wrapper).width($(window).width());
	
	if($(window).height() > $(window).width()){
		$(wrapper).height(getProportionalHeight());	
	}else {
		$(wrapper).height($(window).height());
	}
    
    $(wrapper).css('overflow', 'hidden');
    bgImage.width(0);
    bgImage.height(0);
    var screenHeight = wrapper.height();
    var screenWidth = wrapper.width();
    var screenRatio = screenHeight / screenWidth;
    var videoRatio = imgHeight / imgWidth;
    bgImage.width(imgWidth);
    bgImage.height(imgHeight);
    if (screenRatio > videoRatio) {
        bgImage.width(imgWidth * screenHeight / imgHeight);
        bgImage.height(screenHeight);
    } else {
        bgImage.height(imgHeight * screenWidth / imgWidth);
        bgImage.width(screenWidth);
    }

    var dx = 0;
    var dy = 0;
	
    scalePercentage = ($(window).height() / 958) * 100;

    if (bgImage.height() > screenHeight) {
        dy = -(bgImage.height() - screenHeight) / 2;
    }
    if (bgImage.width() > screenWidth) {
        dx = -(bgImage.width() - screenWidth) / 2;
    }
    bgImage.css({
        top: dy,
        left: dx
    });
	$(bgImage).children('.background-tree').width($(bgImage).width() + 300);
	$(bgImage).children('.background-tree').height($(bgImage).height());
    imageSizeSet();
    resizeElements();
    navigation();
    PointerEventsPolyfill.initialize({});
    $('.creeper-2').css('pointer-events', 'none');

    $('.text-content.home').show();
	
	$('.content').css({
		marginTop: -($('.content').height()/2),
		height: (507/736)*$('.content').width() + 'px'
	})
	
	$('ul.navigation li a').css({
		height: (58/167)*$('ul.navigation li a').width() + 'px'
	})
	
}
function imageSizeSet() {

    $('.elements > img').load(function () {
        //preload code
       // $(this).fadeIn();
    }).each(function (index) {
        if (this.complete) {
            $(this).parent().attr('data-height', $(this).height());
            $(this).parent().attr('data-height', $(this).height());


        }
    });


}
function animateLogo() {
/*	$('a.name-board').animate({  deg: -10 }, {
		step: function (now,fx) {
		  $(this).css('-webkit-transform','rotate('+now+'deg)');
		  $(this).css('-moz-transform','rotate('+now+'deg)');
		  $(this).css('transform','rotate('+now+'deg)');
    },
    duration:4000
}).animate({deg: 0 }, {
		step: function (now,fx) {
			  $(this).css('-webkit-transform','rotate('+now+'deg)');
			  $(this).css('-moz-transform','rotate('+now+'deg)');
			  $(this).css('transform','rotate('+now+'deg)');
			},
			duration:4000, function () {alert('dd')})
		})
	*/
}
function resizeElements() {

    var scaleValue = scalePercentage / 100;
    $('.elements > img').each(function () {
        var oriHeight = $(this).parent().data('height');
        var oriWidth = $(this).parent().data('width');

        $(this).css({
            width: scaleValue * oriWidth,
            height: scaleValue * oriHeight
        });
		
		if($(this).parent().hasClass('creeper-1')){
			$(this).css({
				width: scaleValue * oriWidth,
				height: scaleValue * oriHeight - 100
        	});
		}
			
    });
    $('.content-container').css('marginLeft', -($('.content-container').width() / 2));
}
function hideHomeVideo() {
	$('.content .text-content.home .homesource').show();
	$('.content .text-content.home .homeVideo').hide();
	$('.content .text-content.home .homeVideo').html('');
}
function showVideoPlaceHolder() {
    hideHomeVideo();
}
function populateVideo() {
   // var width = Math.round($('.content .text-content.home').width()) * 0.90;
    //var ratio = 16 / 9;
    //var height = Math.round(width / ratio + 32); /* 32px is approx. height of controls */
    var height = $('.homesource img').height();
	$('.content .text-content.home .homeVideo').html("<iframe id='showreel' src='https://player.vimeo.com/video/93143232' width='100%' height='" + height + "' frameborder='0' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>");
}
function showHomeVideo() {
	//window.setTimeout(createVideo, 5000);
    showVideoPlaceHolder();
    //populateVideo();
    //createVideo();
}
function createVideo() {
    populateVideo();
	$('.content .text-content.home .homesource').hide();
	$('.content .text-content.home .homeVideo').show();
}
function navigation() {
    $('a.nav').on('click', function (e) {
        e.preventDefault();
        $('.content .text-content').hide();
        var clsName = $(this).data('target');
        $('.content .text-content.' + clsName).show();
        if (clsName === "home") {
            showHomeVideo();
        } else {
			hideHomeVideo();
		}
		if (clsName === "showcase") {
			$('.gallery').carouSlide.startAnimation();
		} else {
			$('.gallery').carouSlide.stopAnimation();
		}
    });
}
function initiateContactForm(){

    $("#submit_btn").click(function () {
        //get input field values
        var user_name       = $('input[name=name]').val();
        var user_email      = $('input[name=email]').val();
        var user_phone      = $('input[name=phone]').val();
        var user_message    = $('textarea[name=message]').val();

        //simple validation at client's end
        //we simply change border color to red if empty field using .css()
        var proceed = true;
        if (user_name === "") {
            $('input[name=name]').css('border-color', 'red');
            proceed = false;
        }
        if (user_email === "") {
            $('input[name=email]').css('border-color', 'red');
            proceed = false;
        }
        if (user_phone === "") {
            $('input[name=phone]').css('border-color', 'red');
            proceed = false;
        }
        if (user_message === "") {
            $('textarea[name=message]').css('border-color', 'red');
            proceed = false;
        }
        //everything looks good! proceed...
        if (proceed) {
            //data to be sent to server
            var post_data = {'userName': user_name, 'userEmail': user_email, 'userPhone': user_phone, 'userMessage': user_message};

            //Ajax post data to server
            $.post('mailer.php', post_data, function (response) {

                //load json data from server and output message
                if (response.type === 'error') {
                    output = '<div class="error">' + response.text + '</div>';
                } else {

                    output = '<div class="success">' + response.text + '</div>';

                    //reset values in all input fields
                    $('#contact_form input').val('');
                    $('#contact_form textarea').val('');
                }

                $("#result").hide().html(output).slideDown();
            }, 'json');

        }
    });
    //reset previously set border colors and hide all message on .keyup()
    $("#contact_form input, #contact_form textarea").keyup(function () {
        $("#contact_form input, #contact_form textarea").css('border-color', '');
        $("#result").slideUp();
    });
}
